<template>
    <div class="wagesdetails">
        <div style="display: flex;">
            <div>
                <img style="width: 100px;" src="https://heimahr.itheima.net/static/img/img.0615818f.jpeg" alt="">
            </div>
            <div style="line-height: 70px;">
                <div>
                    <el-tag type="danger" effect="dark">
                        离职
                    </el-tag>
                    <div>
                        入职时间：最新工资：
                    </div>
                    <div>当月基本工资 / 当月岗位工资：/</div>

                </div>
            </div>
        </div>
        <div style="width: 100%;">
            <div style="font-weight: 600;margin-bottom: 10px;">津贴</div>
            <div class="jintietitle">
                <div style="display: flex;justify-content: space-around;line-height: 30px;">
                    <div>
                        <div style="font-weight: 600;">津贴类型</div>
                        <div>交通补助</div>
                        <div>午餐补助</div>
                    </div>
                    <div style="text-align: center;">
                        <div style="font-weight: 600;">补贴金额</div>
                        <div>66.00</div>
                        <div>66.00</div>
                    </div>
                    <div>
                        <div style="font-weight: 600;">津贴类型</div>
                        <div>通讯补助</div>
                        <div>住房补助</div>
                    </div>
                    <div style="text-align: center;">
                        <div style="font-weight: 600;">补贴金额</div>
                        <div>66.00</div>
                        <div>66.00</div>
                    </div>
                </div>
            </div>
        </div>
        <div style="width: 100%;">
            <div style="display: flex; align-items: center;justify-content: space-between;width: 20%;">
                <div style="font-weight: 600;margin: 10px 0px;">社保公积金</div>
                <div>企业--</div>
                <div>个人--</div>
            </div>
            <div class="jintietitle">
                <div style="display: flex;justify-content: space-around;line-height: 30px;">
                    <div style="text-align: center;">
                        <div style="font-weight: 600;">缴费项目</div>
                        <div>社保</div>
                        <div>公积金</div>
                        <div>缴费合计</div>
                    </div>
                    <div style="text-align: center;">
                        <div style="font-weight: 600;">基数</div>
                        <div>--</div>
                        <div>--</div>
                        <div>--</div>
                    </div>
                    <div style="text-align: center;">
                        <div style="font-weight: 600;">企业缴纳</div>
                        <div>--</div>
                        <div>--</div>
                        <div>--</div>
                    </div>
                    <div style="text-align: center;">
                        <div style="font-weight: 600;">个人缴纳</div>
                        <div>--</div>
                        <div>--</div>
                        <div>--</div>
                    </div>
                </div>
            </div>
        </div>
        <div style="display: flex;align-items: center;margin-top: 20px">
            <div style="font-weight: 600;font-size: 14px;color:#606266 ;">
                <div style="height: 40px;display: flex;align-items: center;margin-bottom: 20px;">
                    实际出勤天数（正式）：
                </div>
                <div style="height: 40px;display: flex;align-items: center;">
                    计薪天数（正式）：
                </div>
            </div>
            <div>
                <div style="height: 40px;margin-bottom: 20px;">
                    <el-input value="0" disabled style="height: 40px;width: 700px;" />
                </div>
                <div style="height: 40px;">
                    <el-input value="0" disabled style="height: 40px;width: 700px;" />
                </div>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">

</script>

<style scoped>
@import '../../assets/Wages.css'
</style>